<template>
	<view class="">
	<view class="myHome">
		<view class="myHome_top">
			<image src="../../static/images/topbg_02.png" mode="" class="myhome_bg" ></image>
			<view class="myHome_infor"  :style="{paddingTop: statusBarHeight + 'px'}"S>
				<view class="">
					<image src="../../static/images/home_10.png" mode=""></image>
					<view class="">{{userInfor.nickName}}</view>
				</view>
			</view>
		</view>
		<view class="myHome_list flex">
			<view class="list_left ">
				<image src="../../static/images/my_07.png" mode=""></image>
				<view class="">{{userInfor.phonenumber}}</view>
			</view>
			<view class="line"></view>
			<view class="list_left ">
				<image src="../../static/images/my_04.png" mode=""></image>
				<view class="">{{filterName(roles)}}</view>
			</view>
		</view>
		<view class="myhome_Task">
			<view class="flex minListw flex-between align-center" @click="attendance">
				<image src="../../static/images/my_12.png" mode="" class="img"></image>
				<view class="min_left flex-g flex flex-between">
					<view class="">考勤打卡</view>
					<image src="../../static/images/next_icon.png" mode=""></image>
				</view>
			</view>
			<view class="flex minListw flex-between align-center">
				<image src="../../static/images/my_16.png" mode="" class="img"></image>
				<view class="min_left flex-g flex flex-between">
					<view class="">轨迹查询</view>
					<image src="../../static/images/next_icon.png" mode=""></image>
				</view>
			</view>
			<view class="flex minListw flex-between align-center">
				<image src="../../static/images/my_20.png" mode="" class="img"></image>
				<view class="min_left flex-g flex flex-between">
					<view class="">通讯录</view>
					<image src="../../static/images/next_icon.png" mode=""></image>
				</view>
			</view>
			<view class="flex minListw flex-between align-center">
				<image src="../../static/images/my_23.png" mode="" class="img"></image>
				<view class="min_left flex-g flex flex-between">
					<view class="">修改密码</view>
					<image src="../../static/images/next_icon.png" mode=""></image>
				</view>
			</view>
			<view class="flex minListw flex-between align-center">
				<image src="../../static/images/my_26.png" mode="" class="img"></image>
				<view class="min_left flex-g flex flex-between">
					<view class="">帮助</view>
					<image src="../../static/images/next_icon.png" mode=""></image>
				</view>
			</view>
			<view class="flex minListw flex-between align-center">
				<image src="../../static/images/my_29.png" mode="" class="img"></image>
				<view class="min_left flex-g flex flex-between">
					<view class="">当前版本号</view>
					<image src="../../static/images/next_icon.png" mode=""></image>
				</view>
			</view>
			<view class="flex minListw flex-between align-center" @click="appUpdata">
				<image src="../../static/images/my_32.png" mode="" class="img"></image>
				<view class="min_left flex-g flex flex-between">
					<view class="">检测更新</view>
					<image src="../../static/images/next_icon.png" mode=""></image>
				</view>
			</view>
		</view>
		<view class="myhome_Task mb30" @click="cance">
			<view class="flex minListw flex-between align-center">
				<image src="../../static/images/my_36.png" mode="" class="img"></image>
				<view class="min_left flex-g flex flex-between">
					<view class="">注销</view>
					<image src="../../static/images/next_icon.png" mode=""></image>
				</view>
			</view>
		</view>
	</view>
	<u-tabbar @change="changetab" v-model="current" :list="$store.state.tabBarList" :mid-button="true"></u-tabbar>
	</view>
</template>

<script>
	import {mapState} from 'vuex';
	import {LoginOut,getAppversion} from '../../util/api.js';
	import URL from '../../util/url.js'
	export default {
		data() {
			return {
				statusBarHeight: uni.getSystemInfoSync().statusBarHeight,
				current:2,
				userInfor:'',
				roles:[],
				app_version:'',
				type:'',
			}
		},
		computed: {
			...mapState(["newRules"]),
		},
		onLoad() {
			this.userInfor = uni.getStorageSync('userInfor');
			this.roles = uni.getStorageSync('roles')
			let system= uni.getSystemInfoSync().platform;
			if(system == 'ios'){
				this.type = "handle_ios";
			}
			if(system == 'android'){
				this.type = "handle";  //businessDisposal
			}
			// #ifdef APP-VUE
			  this.getAppVersion();
			// #endif
		},
		methods: {
			//获取版本信息
			getAppVersion(){
				plus.runtime.getProperty( plus.runtime.appid, ( wgtinfo ) => {
					this.app_version = wgtinfo.version;
				} );
			},
			//版本更新
			appUpdata(){
				let appVersion = ''
				uni.getSystemInfo({
					success: function(e) {
						appVersion = e.platform
					}
				})
				let _this = this;
				//此处为访问后台是否有更新
				getAppversion({type: this.type}).then( res => {
					//如果后台版本比当前版本高则更新
					console.log(res.data.appVersion);
					console.log(this.app_version);
					if (res.data.appVersion != this.app_version) {
							uni.showModal({
								title: "版本更新",
								content: res.data.updateContent, //更新描述
								confirmText:'立即更新',
								cancelText:'稍后进行',
								success: sucRes => {
									if (sucRes.confirm) {
										//如果是安卓直接更新下载
										if(appVersion === 'android'){
											_this.doUpData(res.data.url);
										//如果是ios跳转到app store
										}else{
											//在App Store Connect中的App Store下的app信息，可找到appleId
											let appleId= 123456789
											plus.runtime.launchApplication({
												action: `itms-apps://itunes.apple.com/cn/app/id${appleId}?mt=8`
											}, function(e) {
												console.log('Open system default browser failed: ' + e.message);
											});
										}
									}
								}
							})
					}else{
						uni.showToast({icon:'none',title:'当前已是最新版本'})
					}
				})
			},
			
			doUpData(dressapk) {
				console.log(URL.IMAGEURL1 + dressapk)
			    uni.showLoading({
			        title: '更新中……'
			    })
			    uni.downloadFile({//执行下载
			        url: URL.IMAGEURL1 + dressapk , //下载地址
			        success: data => {//下载成功
			            uni.hideLoading();
						console.log(data)
			            if (data.statusCode == 200) {
			                uni.showModal({
			                    title: '',
			                    content: '更新成功，确定现在安装吗？',
			                    confirmText: '安装',
			                    confirmColor: '#4596FD',
			                    success: function(res) {
			                        if (data.statusCode === 200) {
			                            plus.runtime.install(data.tempFilePath, {
			                                    force: true
			                                }, function(res) {
			                                    utils.showToast('更新成功，重启中');
			                                    plus.runtime.restart();
			                                }
			                            );
			                        }
			                    }
			                });
			            }
			        }
			    });
			},
			
			filterName(data){
				let targetData = this.newRules&&this.newRules.length>0?
				this.newRules.filter(t=>data.indexOf(t.name)!=-1).map(s=>s.value).join(","):"";
				return targetData;
			},
			attendance(){
				// uni.navigateTo({
				// 	url:'../punchClock/punchClock'
				// })
			},
			cance(){
				uni.showModal({
					title: '提示',
					content:'确定是否退出登录',
					cancelText: "取消", // 取消按钮的文字  
					confirmText: "确定", // 确认按钮文字  
					showCancel: true, // 是否显示取消按钮，默认为 true
					confirmColor: '#f55850',
					cancelColor: '#4599E7',
					success: (res) => {
						if(res.confirm) { 
							uni.$emit('killLocationTimer');
							this.loginout()
						} else {  
							console.log('else', res)
						}  
					} 
				})
			},
			loginout(){
				var parse = {
					pushId:uni.getStorageSync('pushId'),
					userId:this.userInfor.userId
				}
				LoginOut(parse).then((res)=>{
					if(res.code == 200){
						uni.removeStorageSync('token');
						uni.removeStorageSync('token_type');
						uni.removeStorageSync('userInfor');
						uni.removeStorageSync('roles');
						uni.removeStorageSync('szcgArchivesSrc');
						this.$toast.showToast(res.msg)
						setTimeout(()=>{
							uni.reLaunch({
								url:'../login'
							})
						},1000)
					}else{
						this.$toast.showToast(res.msg)
					}
				}).catch((err)=>{
					console.log(err)
				})
			},
			changetab(index){
				let url =""
				switch(index){
					case 0:
					url="/pages/index/index"
					break;
					case 1:
					url="/pages/reporting/reporting"
					break;
					default:
					url="/pages/my/my"
					break;
				}
				index!=1?uni.switchTab({
					url:url
				}):uni.navigateTo({
					url:url
				})
			}
		}
	}
</script>

<style scoped lang="scss">
.myHome{
	width: 100vw;
	background-color: #F6F7FB;
	.myHome_top{
		width: 100%;
		.myhome_bg{
			width: 100%;
			height: 344rpx;
		}
		.myHome_infor{
			position: absolute;
			top: 102rpx;
			color: #FFFFFF;
			width: 100%;
			text-align: center;
			font-weight: bolder;
			image{
				width: 112rpx;
				height: 112rpx;
			}
		}
	}
	.myHome_list{
		width: 100%;
		background-color: #FFFFFF;
		.line{
			width: 4rpx;
			height: 40rpx;
			background-color: #EEEEEE;
			margin-top: 60rpx;
		}
		.list_left{
			text-align: center;
			padding: 40rpx 0rpx;
			font-size: 28rpx;
			flex: 10;
			image{
				width: 36rpx;
				height: 36rpx;
			}
		}
	}
	.myhome_Task{
		margin-top: 30rpx;
		background-color: #FFFFFF;
		padding: 0rpx 0rpx 0rpx 67rpx;
		.minListw{
			.min_left{
				padding: 30rpx 80rpx 25rpx 0rpx;
				border-bottom: 1px solid #F5F6F8;
				image{
					width: 20rpx;
					height: 36rpx;
				}
			}
			.img{
				width: 43rpx;
				height: 43rpx;
				margin-right: 40rpx;
			}
		}
	}
}
</style>
